<template>
  <div class="login-wrapper">
    <div>
      <label>用户名：</label>
      <input type="text" placeholder="请输入用户名" v-model="userName">
    </div>
    <div>
      <label>密码：</label>
      <input type="password" placeholder="请输入密码" v-model="password">
    </div>
    <button @click="login">登陆</button>
  </div>
</template>

<script>
// @ is an alias to /src

export default {
  name: 'Home',
  data: function () {
    return {
      userName: 'hm@qq.com',
      password: '123456'
    }
  },
  methods: {
    login: function () {
      const that = this

      if (that.userName === '' || that.password === '') {
        alert('用户名或密码未输入')
        return
      }

      const params = {
        email: that.userName,
        password: that.password
      }

      console.log(params)
      that.axios
        .post('/sign_in',
          params)
        .then(data => {
          console.log(data)
          if (data.code != 0) {
            alert('用户名或密码不正确')
            return
          }
          // 将username存入vuex
          that.$store.commit('setUserInfo', data.data)
          //跳转到首页
          that.$router.push({ path: '/' })
        })
    }
  }
}
</script>
